//圆角
@mixin borderRadius($radius) {
    -webkit-border-radius: $radius;
    -moz-border-radius   : $radius;
    -ms-border-radius    : $radius;
    -o-border-radius     : $radius;
    border-radius        : $radius;
}

$red: #F63515;


@font-face {
    font-family: "iconfont";
    src        : url('iconfont.eot?t=1583298147028');
    /* IE9 */
    src: url('iconfont.eot?t=1583298147028#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
        url('iconfont.woff?t=1583298147028') format('woff'),
        url('iconfont.ttf?t=1583298147028') format('truetype'),
        /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
        url('iconfont.svg?t=1583298147028#iconfont') format('svg');
    /* iOS 4.1- */
}

.iconfont {
    font-family            : "iconfont" !important;
    font-size              : 16px;
    font-style             : normal;
    -webkit-font-smoothing : antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-icon-test6:before {
    content: "\e61b";
}

.icon-jiangxu:before {
    content: "\e6a1";
}

.icon-shengxu:before {
    content: "\e6a2";
}

.icon-shaixuan:before {
    content: "\e660";
}

.icon-caidan:before {
    content: "\e790";
}

.icon-yonghu:before {
    content: "\e638";
}

.icon-gengduo:before {
    content: "\e625";
}

.icon-sousuo:before {
    content: "\e61c";
}

.icon-fanhui:before {
    content: "\e615";
}

.icon-icon-test:before {
    content: "\e635";
}

.icon-icon-test1:before {
    content: "\e637";
}

.icon-icon-test2:before {
    content: "\e63b";
}

.icon-icon-test3:before {
    content: "\e64f";
}

.icon-icon-test4:before {
    content: "\e657";
}

.icon-icon-test5:before {
    content: "\e658";
}



.product-list-header {
    position  : fixed;
    left      : 0;
    top       : 0;
    width     : 100%;
    z-index   : 1000;
    background: #fff;

    .header-search {
        display    : flex;
        align-items: center;
        width      : 76%;
        height     : 32rpx;
        line-height: 32rpx;
        margin     : 20rpx 0;
        padding    : 10rpx 0;
        color      : #232326;
        background : #f7f7f7;
        @include borderRadius(32rpx);

        .icon-sousuo {
            padding  : 0 10rpx 0 40rpx;
            font-size: 34rpx;
        }

        .search-title {
            font-size : 24rpx;
            color     : #666;
            background: #f7f7f7;
        }
    }


    .select-menu {
        display        : flex;
        justify-content: space-around;
        width          : 100%;
        height         : 100rpx;
        background     : #fff;

        .select-item {
            flex         : 1;
            height       : 100%;
            text-align   : center;
            line-height  : 100rpx;
            font-size    : 30rpx;
            border-top   : 1px solid #dcdcdc;
            border-bottom: 1px solid #dcdcdc;

            // .select-item 内部书写
            &.active {
                color: $red;
            }

            .iconfont {

                &.icon-jiangxu,
                &.icon-shengxu,
                &.icon-shaixuan {
                    color       : #999;
                    padding-left: 10rpx;
                    font-size   : 28rpx;
                }

                &.active {
                    color: $red;
                }
            }
        }
    }
}

.product-list {
    width: 100%;

    .product-container {
        position  : absolute;
        left      : 0;
        top       : 220rpx;
        width     : 100%;
        overflow-y: scroll;
        height    : auto;
    }
}